<div th:fragment="history_list">
<div id="HistoryModal" style="" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-keyboard="false">
    <div class="modal-dialog modal-md" style="width:1000px;" id="modal-dialog">
        <div class="modal-content" id="history">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="HistoryModalLabel"></h4>
            </div>
            <div class="modal-body" style="overflow: auto;" id="myModalBody">

                <table class="table table-hover table-primary table-striped">
                    <thead>
                    <tr>
                        <th style="text-align: center; vertical-align: middle;">序号</th>
                        <th style="text-align: center; vertical-align: middle;">变更前专家状态</th>
                        <th style="text-align: center; vertical-align: middle;">变更后专家状态</th>
                        <th style="text-align: center; vertical-align: middle;">转自单位</th>
                        <th style="text-align: center; vertical-align: middle;">转至单位</th>
                        <th style="text-align: center; vertical-align: middle;">状态变更时间</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(historyitem,index) in historylist"  v-if="historylist.length > 0">
                        <td style="vertical-align: middle; text-align: center;" v-text="index+1"></td>
                        <td style="vertical-align: middle; text-align: center;" v-text="historyitem.oldzhuantai"></td>
                        <td style="vertical-align: middle; text-align: center;" v-text="historyitem.newzhuangtai"></td>
                        <td style="vertical-align: middle; text-align: center;" v-text="historyitem.olddanwei"></td>
                        <td style="vertical-align: middle; text-align: center;" v-text="historyitem.newdanwei"></td>
                        <td style="vertical-align: middle; text-align: center;" v-text="historyitem.biandongshijian"></td>
                    </tr>
                    <tr v-if="historylist.length == 0">
                        <td style="text-align: center; vertical-align: middle" colspan="6">查无数据</td>
                    </tr>
                    </tbody>
                </table>

            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>

</div>

<script>
    var History = new Vue({
        el : "#history",
        data : {
            zhuanjiaid : '',		// 单位ID

            historylist : [],

        },
        created : function(){
            var _this = this;

        },
        methods : {

            //审核记录
            showHistoryModel:function(){
                var _this = this;

                $("#HistoryModalLabel").html("专家状态变更记录");
                $("#HistoryModal").modal();

                _this.bindHistory();
            },

            bindHistory:function(){
                var _this = this;

                $.post('/system/biandonghistory/list', {
                    zhuanjiaid : _this.zhuanjiaid,
                    rdm : Math.random()
                },function(ppData) {
                    if (ppData != null) {
                        _this.historylist = ppData.rows;
                    }
                },"json");
            },

        },
    })
</script>

</div>